rehype-stringify

What is rehype-stringify?

rehype-stringify is a plugin for the rehype ecosystem that compiles a syntax tree into HTML. It is typically used in conjunction with other rehype plugins to process and transform HTML content.

What are rehype-stringify's main functionalities?

Basic HTML Stringification

This feature allows you to convert an HTML string into a syntax tree and then back into an HTML string. It demonstrates the basic usage of rehype-stringify in a unified pipeline.

const unified = require('unified');
const rehypeParse = require('rehype-parse');
const rehypeStringify = require('rehype-stringify');

const html = '<h1>Hello, world!</h1>';

unified()
  .use(rehypeParse)
  .use(rehypeStringify)
  .process(html)
  .then((file) => {
    console.log(String(file));
  });

Transforming HTML

This feature demonstrates how you can transform HTML content by modifying the syntax tree before stringifying it back to HTML. In this example, the text inside the <h1> tag is changed from 'Hello, world!' to 'Hello, universe!'.

const unified = require('unified');
const rehypeParse = require('rehype-parse');
const rehypeStringify = require('rehype-stringify');
const rehype = require('rehype');

const html = '<h1>Hello, world!</h1>';

unified()
  .use(rehypeParse)
  .use(() => (tree) => {
    tree.children[0].children[0].value = 'Hello, universe!';
  })
  .use(rehypeStringify)
  .process(html)
  .then((file) => {
    console.log(String(file));
  });

Other packages similar to rehype-stringify

htmlparser2

htmlparser2 is a fast and forgiving HTML/XML parser. It can be used to parse HTML into a DOM-like structure, which can then be manipulated and serialized back to HTML. Unlike rehype-stringify, htmlparser2 is more focused on parsing and does not provide a unified pipeline for transformations.

jsdom

jsdom is a JavaScript implementation of the DOM and HTML standards. It allows you to create and manipulate a DOM tree in a Node.js environment. While jsdom provides a more complete DOM API, it is heavier and more complex compared to rehype-stringify, which is more lightweight and focused on HTML stringification.

cheerio

cheerio is a fast, flexible, and lean implementation of core jQuery designed specifically for the server. It parses HTML and XML and provides a jQuery-like API for manipulating the resulting DOM. Cheerio is similar to rehype-stringify in that it allows for HTML manipulation, but it uses a different API and is more focused on jQuery-like operations.

README

rehype-stringify

Compiler for unified. Stringifies hast syntax trees to HTML. Used in the rehype processor but can be used on its own as well.

---

Announcing the unified collective! 🎉 Read more about it on Medium »

Sponsors

🥇 ZEIT

🥇 Gatsby

🥉 Compositor

Holloway

You?

Installation

npm:

npm install rehype-stringify

Usage

var unified = require('unified')
var createStream = require('unified-stream')
var parse = require('rehype-parse')
var stringify = require('rehype-stringify')

var processor = unified()
  .use(parse)
  .use(stringify, {
    quoteSmart: true,
    closeSelfClosing: true,
    omitOptionalTags: true,
    entities: {useShortestReferences: true}
  })

process.stdin.pipe(createStream(processor)).pipe(process.stdout)

API

processor.use(stringify[, options])

Configure the processor to stringify hast syntax trees to HTML.

options

Options can be passed when using processor.use(stringify, options). All settings are passed to hast-util-to-html.

License

MIT © Titus Wormer